import React, { Component, Suspense } from 'react'
import "../static/css/base.css";
import { PageHeader, Button } from 'antd';
import { HashRouter, NavLink } from 'react-router-dom';
import RouterMaker from '../router/RouterMaker'

export default class Layout extends Component {
    render() {
        return (
            <div id="layout_app" className="site-page-header-ghost-wrapper">
                <PageHeader
                    ghost={false}
                    title="优音乐"
                    extra={[
                        <Button key="1" shape="round">
                            下载App
                        </Button>,
                    ]}
                >
                </PageHeader>
                <HashRouter>
                <div className="navbar">
                    <NavLink to="/index">推荐</NavLink>
                    <NavLink to="/hot">热歌</NavLink>
                    <NavLink to="/search">搜索</NavLink>
                </div>
                <div>
                    <Suspense fallback={<h1>加载中</h1>}>
                        <RouterMaker />
                    </Suspense>
                </div>
                </HashRouter>
            </div>
        )
    }
}
